<template>
	<view class="container">
		<view class="profit">
			<view class="money">
				<view>{{money}}</view>
				<text>总收益</text>
			</view>
		</view>

		<scroll-view scroll-y class="list" v-if="list.length!=0" @scrolltolower="loadMore">
			<view class="list-item" v-for="(item,index) in list" :key="item.order_sn">
				<view>
					<text>收益分成</text>
					<view>{{item.createtime_date}}</view>
				</view>
				<view>
					<text class="qian">+{{item.money}}</text>
					<view class="memo">{{item.memo}}</view>
				</view>
			</view>
		</scroll-view>

		<view class="list" v-else>
			<view class="empty">
				暂无收益记录
			</view>
		</view>

	</view>
</template>

<script>
	import {
		moneyRecord
	} from '../../../api/api.js'
	export default {
		data() {
			return {
				money: '4800.00',
				list: [],
				total: '',
				current_page: 1,
				limit: 10,
				last_page: 1
			}
		},
		onLoad() {
			this.getRecord()
		},
		methods: {
			loadMore() {
				if (this.current_page > this.last_page) {
					uni.showToast({
						icon: 'none',
						title: '没有更多收益记录了'
					})
					return
				}
				moneyRecord({
					limit: this.limit,
					page: this.current_page
				}).then(res => {
					for (let i = 0; i < res.data.data.length; i++) {
						this.list.push(res.data.data[i])
					}
					this.money = res.data.all_income
					this.total = res.data.total
					this.last_page = res.data.last_page
					this.current_page = res.data.current_page + 1
				})
			},
			getRecord() {
				moneyRecord({
					limit: this.limit,
					page: this.current_page
				}).then(res => {
					this.list = res.data.data
					this.money = res.data.all_income
					this.total = res.data.total
					this.last_page = res.data.last_page
					this.current_page = res.data.current_page + 1
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.container {
		width: 100%;
		height: 100%;
	}

	.profit {
		width: 100%;
		height: 300upx;
		background-color: #3EB9FF;
		display: flex;
		justify-content: center;
		align-items: center;

		.money {
			width: 300upx;
			text-align: center;
			color: #fff;

			view {
				font-size: 42upx;
			}

			text {
				font-size: 28upx;
			}
		}
	}

	.list {
		width: calc(100% - 60upx);
		padding: 0 30upx;
		height: calc(100% - 300upx);

		.list-item {
			width: 100%;
			height: 100upx;
			padding: 10upx 0;
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1upx solid #ECECEC;

			.qian {
				color: #3EB9FF;
			}

			view {
				text {
					color: #333333;
					font-size: 32upx;
				}

				view {
					margin-top: 10upx;
					font-size: 24upx;
					color: #999999;
				}
				
				.memo{
					text-align: right;
				}
			}


		}

		.empty {
			width: 100%;
			height: 100upx;
			line-height: 100upx;
			text-align: center;
		}
	}
</style>
